<template>
  <div id="app">
    <keep-alive>
      <router-view v-if="$route.meta.keepAlive" />
    </keep-alive>
    <router-view v-if="!$route.meta.keepAlive"></router-view>
    <keep-alive>
      <van-tabbar
        v-model="active"
        v-show="$route.meta.showTabbar"
        active-color="#3EAD3E"
      >
        <van-tabbar-item replace to="/" icon="home-o">主页</van-tabbar-item>
        <van-tabbar-item replace to="/sapecial" icon="gem-o"
          >专题</van-tabbar-item
        >
        <van-tabbar-item replace to="/search" icon="search"
          >搜索</van-tabbar-item
        >
        <van-tabbar-item replace to="/me" icon="manager-o"
          >我的</van-tabbar-item
        >
      </van-tabbar>
    </keep-alive>
  </div>
</template>

<script>
export default {
  data() {
    return {
      active: 0,
    };
  },
};
</script>


<style lang="scss" scoped>
.van-tabbar {
  background-color: #eee;
}

.van-tabbar-item--active {
  background-color: #eee;
}
</style>
